import './../../styles/appleItem.scss'
import { useRootStore } from './../../store/root.store'
function AppleItem({ apple }) {
    const { AppleStore } = useRootStore()

    return (
        <div className="appleItem">
            <div className="apple"><img src={require('./../../images/apple.png').default} alt="" /></div>
            <div className="info">
                <div className="name">红苹果 - {apple.id + 1} 号</div>
                <div className="weight">{apple.weight} 克</div>
            </div>
            <div className="btn-div">
                <button onClick={() => AppleStore.eatApple(apple.id)}> 吃掉 </button>
            </div>
        </div>
    )
}

export default AppleItem
